<template>
  <div class="container">
    <!-- <div class="hoverNeedShow">返回返回返回</div> -->

    <img :src="activityId" alt="" class="img" />
    <a-button
      type="primary"
      size="large"
      style="margin-top: 60px; width: 200px"
      @click="comeBack"
    >
      返回
    </a-button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      activityId: "",
    };
  },
  created() {
    this.getCode();
  },
  methods: {
    async getCode() {
      this.activityId = localStorage.getItem("activeId");
      console.log(this.$router);
      if (this.activityId) {
        //存在再发送 否则存在 undefined的风险
        const { data: res } = await this.$http.get(
          `/admin/activity/qrcode/${this.activityId}`
        );
        console.log(res);
        this.activityId = res.data;
        if (res.code != 200) {
          // 如果出现其他不允许的情况 比如时间未到 等
          this.$router.push({
            name: "active",
          });
        }
      }
    },
    comeBack() {
      this.$router.push({
        name: "active",
      });
    },
  },
};
</script>
<style  lang='less' scoped>
.container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
}

.container img {
  width: 350px;
  height: 350px;
}
.hoverNeedShow {
  position: absolute;
  top: 0;
  left: -50%;
  width: 350px;
  height: 40px;
  background-color: #fff;
}
</style>